<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
    <link rel="stylesheet" href="../css/login.css">
    <link rel="shortcut icon" href="../img/favicon.ico" type="image/x-icon" />
</head>

<!--<frameset cols="15%,*" frameborder="no" border="0" framespacing="0">
    <frame src="" name="left" scrolling="no" id="left">
    <frame src="" name="right" id="right" >
</frameset>-->

<body>
<div id="app">
    <div class="wrap" id="wrap">
        <form name="login" action="" method="post">
            <div class="logGet" align="center">
                <!-- 头部提示信息 -->
                <div class="logD logDtip">
                    <p class="p1" style="color: mediumseagreen">请登录</p>
                </div>
                <!-- 输入框 -->
                <div class="lgD">
                    <img src="../img/logName.png" width="20" height="20" alt=""/>
                    <input type="text" name="username" placeholder="输入账号" />
                </div>
                <div class="lgD">
                    <img src="../img/logPwd.png" width="20" height="20" alt=""/>
                    <input type="password" name="password" placeholder="输入用户密码" />
                </div>
                <div style="margin-left: 250px">
                    <a style="color: grey" href="user/regist.html"><span>没有账号?</span></a>
                </div>
                <div class="logC" style="margin-top: 3px">
                    <input type="button" @click="check();" value="登录" class="submitbutton">
                </div>
            </div>
        </form>
    </div>
</div>
</body>
<!-- 引入vue和elementUI所需配置文件 -->
<!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
<script src="../js/vue.js"></script>
<script src="../js/axios.js"></script>
<script>
    new Vue({
        el:"#app",
        data(){
            return {
                result:[{status:0}]
            }
        },
        methods:{
            //t
            check:function () {
                let id = document.login.username.value;
                let userPassword = document.login.password.value;
                if(id==''||id==null){
                    alert("账号不能为空");
                    return false;
                }else if(userPassword==''||userPassword==null){
                    alert("密码不能为空");
                    return false;
                }else{
                    this.loginSearch(id,userPassword);
                }
            },
            //t
            loginSearch:function (id,userPassword) {
                axios.post(`/login/findList.do`,{id:id,password:userPassword}).then(response=>{
                    this.result=response.data;       //返回的是list集合，因此要取第一个元素。
                    if (this.result.length==0){      //不会弹框
                        alert("账号密码不正确，请重新输入！");
                    }else{
                        //将登录用户的数据存储起来
                        sessionStorage.setItem("status",this.result[0].status);
                        sessionStorage.setItem("userId",id);
                        //判断进入登录页面是否有上一页
                        let flag= document.referrer === '' ; //布尔变量
                        switch (this.result[0].status){
                            //若是直接登录的，则跳转到主页；若是因为需求进行登录的，返回上一页。
                            case 1:flag?window.location.href="/pages/user/index.html":window.history.go(-1);break;//登录的是用户
                            case 2:window.location.href="/pages/business/index.html";break;   //登录的是商家
                            case 3:window.location.href="/pages/shop/index.html";break;   //登陆的是店铺
                        }
                    }
                })
            },
        }
    });
</script>

</html>